/**
 * @description  行业敞口明细
 * @author zls
 */
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { TableC, FirstHeaderC, SecondHeaderC } from '@/src/comps';

class detail extends PureComponent {
  constructor() {
    super();
    this.state = {
      data: {
        columns: [],
      },
      loading: false,
    };
  }

  componentDidMount() {
    const { searchData } = this.props;

    this.getData({ ...searchData });
  }

  UNSAFE_componentWillReceiveProps(nextProps) {
    const { searchData } = this.props;
    if (JSON.stringify(nextProps.searchData) !== JSON.stringify(searchData)) {
      this.getData({ ...nextProps.searchData });
    }
  }

  //获取数据
  getData = (payload) => {
    this.setState({ loading: true });
    this.props.dispatch({
      type: 'keyRateDurationsM/getKrdDetail',
      payload: {
        ...payload,
      },
      callback: (data) => {
        if (data) {
          this.setState({
            data: data.data,
            loading: false,
          });
        } else {
          this.setState({
            data: {},
            loading: false,
          });
        }
      },
    });
  };

  render() {
    const { data } = this.state;
    const { columns = [], dataSource } = data;
    const newColumns = columns.map((x) => {
      if (['bondCategory'].indexOf(x.key) > -1) {
        return {
          ...x,
          width: '100px',
          fixed: 'left',
        };
      }
      if (x.key == 'underlying') {
        return {
          ...x,
          width: '100px',
          fixed: 'left',
          render: (text, item) => (item.bondCategory ? '' : `${item.tradingCode}-${item.tradingCode}-${item.secuabbr}`),
        };
      }

      if (['bondSum'].indexOf(x.key) > -1) {
        return {
          ...x,
          width: '100px',
          type: 'number',
          toFixed: 4,
          fixed: 'right',
        };
      }

      return {
        ...x,
        type: 'number',
        toFixed: 4,
      };
    });

    return (
      <div style={{ marginTop: '20px' }}>
        <SecondHeaderC title='关键利率久期明细' />
        <TableC columns={newColumns} dataSource={dataSource} loading={this.state.loading} scroll={{ x: 'max-content', y: 500 }} hidePage={true} rowKey='id'></TableC>
      </div>
    );
  }
}
export default connect(({ keyRateDurationsM, loading }) => ({
  keyRateDurationsM,
  loading: loading.effects['keyRateDurationsM/getIndustryExposureDetail'],
}))(detail);
